﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta charset="utf-8" />
    <title>Login Page - Ace Admin</title>

    <meta name="description" content="User login page" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

    <!-- bootstrap & fontawesome -->
    <link rel="stylesheet" href="__ADMIN__/css/bootstrap.css" />
    <link rel="stylesheet" href="__ADMIN__/css/font-awesome.css" />

    <!-- text fonts -->
    <link rel="stylesheet" href="__ADMIN__/css/ace-fonts.css" />

    <!-- ace styles -->
    <link rel="stylesheet" href="__ADMIN__/css/ace.css" />

    <!--[if lte IE 9]>
    <link rel="stylesheet" href="../assets/css/ace-part2.css" />
    <![endif]-->
    <link rel="stylesheet" href="__ADMIN__/css/ace-rtl.css" />

    <!--[if lte IE 9]>
    <link rel="stylesheet" href="../assets/css/ace-ie.css" />
    <![endif]-->

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->

    <!--[if lt IE 9]>
    <script src="../assets/js/html5shiv.js"></script>
    <script src="../assets/js/respond.js"></script>
    <![endif]-->
    <style>
        body{
            background-color:#efefef !important;
        }
        .box_top{
            margin:30px auto;
            width:60%;
        }
        .box_left{
            float:left;
        }
        .box_right{
            float:left;
            font-size:30px;
            color:#19a2e8;
            margin-top:15px;
        }
        .checkbox{
            height: 20px;
        }

    </style>
</head>

<body class="login-layout">
<div class="main-container">
    <div class="main-content">
        <div class="row">
            <div class="col-sm-10 col-sm-offset-1">
                <div class="login-container" style="margin-top:50px">
                    <div class="space-6"></div>
                    <div class="position-relative">
                        <div id="login-box" class="login-box visible  no-border" >
                            <div class="widget-body">
                                <div class="widget-main" style="padding:22px;background-color: #fff !important;">
                                    <div class="box_top clearfix">
                                        <div class="box_left">
                                            <img width="80" src="__ADMIN__/image/logo.png" alt="">
                                        </div>
                                        <div class="box_right">
                                            &nbsp;私有云
                                        </div>

                                    </div>

                                    <div class="space-6"></div>

                                    <form action="" method="post">
                                        <fieldset>
                                            <label class="block clearfix" style="margin-bottom: 5px">
                                                <span class="block input-icon input-icon-right">
                                                    <input type="text" class="form-control" placeholder="用户名" onblur="checkUserName()" value="" id="username" name="username"  />
                                                    <i class="ace-icon fa fa-user"></i>
                                                </span>
                                            </label>
                                            <div class="checkbox"><span id="checkusername" class="warning">&nbsp;</span></div>
                                            <label class="block clearfix" style="margin-bottom: 5px">
                                                <span class="block input-icon input-icon-right">
                                                    <input type="password" class="form-control" placeholder="密码" onblur="checkPassword()"  value=""  name="password" id="password" maxlength="20" tabindex="2" />
                                                    <i class="ace-icon fa fa-lock"></i>
                                                </span>
                                            </label>
                                            <div class="checkbox"><span id="checkpassword" class="warning">&nbsp;</span></div>

                                            <label class="block clearfix" style="margin-bottom: 5px">
                                                <span class="block input-icon input-icon-right">
                                                    <input type="password" class="form-control" placeholder="确认密码" onblur="checkPassword2()"  value=""  name="password" id="password2" maxlength="20" tabindex="3" />
                                                    <i class="ace-icon fa fa-lock"></i>
                                                </span>
                                            </label>
                                            <div class="checkbox"><span id="checkpassword2" class="warning">&nbsp;</span></div>

                                            <label class="block clearfix" style="margin-bottom: 5px">
                                                <span class="block input-icon input-icon-right">
                                                    <input type="email" class="form-control" placeholder="邮箱" id="email" name="email" />
                                                    <i class="ace-icon fa fa-lock"></i>
                                                </span>
                                            </label>
                                            <div class="checkbox"><span id="checkemail" class="warning">&nbsp;</span></div>
                                            <label class="block clearfix" style="margin-bottom: 5px">
														<span class="block input-icon input-icon-right">
                                                            <div class="col-xs-6 col-md-6" style="margin-left: -12px;">
															<input type="text"  placeholder="验证码" id="seccode" autocomplete="off" tabindex="5" onblur="checkSeccode()" size="12" value="" name="seccode" />  </div>
                                                            <div class="col-xs-6 col-md-6" style="margin-left: -12px;">
                                                                <img  style="" id="verify_img" src="{:captcha_src()}" alt="验证码" onclick="refreshVerify()">
                                                            </div>
                                                        </span>
                                            </label>
                                            <div class="checkbox"><span id="checkseccode" class="warning">&nbsp;</span></div>
                                            <div class="space"></div>
                                            <div class="clearfix">
                                                <button type="button" class="width-100 pull-right btn btn-sm btn-primary">
                                                    <i class="ace-icon fa fa-key"></i>
                                                    <span class="bigger-110">注册</span>
                                                </button>
                                            </div>

                                            <div class="space-4"></div>
                                        </fieldset>
                                    </form>
                                    <div class="space-6"></div>
                                </div><!-- /.widget-main -->
                            </div><!-- /.widget-body -->
                        </div><!-- /.login-box -->
                    </div><!-- /.position-relative -->
                </div>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.main-content -->
</div><!-- /.main-container -->

<!-- basic scripts -->

<!--[if !IE]> -->
<script type="text/javascript">
    window.jQuery || document.write("<script src='__ADMIN__/js/jquery.js'>"+"<"+"/script>");
</script>

<!-- <![endif]-->

<!--[if IE]>
<script type="text/javascript">
    window.jQuery || document.write("<script src='__ADMIN__/js/jquery1x.js'>"+"<"+"/script>");
</script>
<![endif]-->
<script type="text/javascript">
    if('ontouchstart' in document.documentElement) document.write("<script src='__ADMIN__/js/jquery.mobile.custom.js'>"+"<"+"/script>");
</script>

<!-- inline scripts related to this page -->
<script type="text/javascript">
    document.getElementById('username').focus();
//    function register(show_id, result) {
//        if(result) {//返回字符s含<ajaxok>
//            document.getElementById('registersubmit').disabled = true;
//            window.location.href = "$refer";
//        } else {
//            updateseccode();
//        }
//    }
    var lastUserName = lastPassword = lastEmail = lastSecCode = '';
    function checkUserName() {
        var cu = document.getElementById('checkusername');
        var userName = document.getElementById('username').value;
        if(userName == lastUserName) { //修复原bug:和上次输入name一样时再点击input框总提示用户名需3-15个字符
            return;
        } else {
            lastUserName = userName;
        }
        var unLen = userName.replace(/[^\x00-\xff]/g, "**").length;
        if(!document.getElementById('username').value.match(/^[0-9a-zA-Z_]+$/)){
            warning(cu, '只允许字母数字下划线');
            return;
        }
        if(document.getElementById('username').value.length == 0||unLen < 3 || unLen > 15){
            warning(cu, '用户名需3-15个字符');
            return;
        }else{
            cu.style.display = '';
            cu.innerHTML = '<img style="vertical-align:middle;" src="__ADMIN__/image/tips_ok.png" width="16" height="16">';
        }
        //ajaxresponse('checkusername', 'op=checkusername&username=' + (is_ie && document.charset == 'utf-8' ? encodeURIComponent(userName) : userName));//重复添加inajax=1避免&#等字符截断ajax标识导致xml错误
        //ajaxresponse('checkusername', 'inajax=1&op=checkusername&username=' + (is_ie && document.charset == 'utf-8' ? encodeURIComponent(userName) : userName));

    }
    function checkPassword(confirm) {
        //参数confirm用于checkPassword2中的checkPassword(true)，下同
        var password = document.getElementById('password').value;
        if(!confirm && password == lastPassword) {
            return;
        } else {
            lastPassword = password;
        }
        var cp = document.getElementById('checkpassword');
        if(password == '' || /[\'\"\\]/.test(password)) {
            warning(cp, '密码空或包含非法字符');
            return false;
        } else if (password.length > 20 || password.length < 6) {
            warning(cp, '长度不符合要求');
            return false;
        } else {
            cp.style.display = '';
            cp.innerHTML = '<img style="vertical-align:middle;" src="__ADMIN__/image/tips_ok.png" width="16" height="16">';
            if(!confirm) {
                checkPassword2(true);
            }
            return true;
        }
    }
    function checkPassword2(confirm) {
        var password = document.getElementById('password').value;
        var password2 = document.getElementById('password2').value;
        var cp2 = document.getElementById('checkpassword2');
        if(password2 != '') {
            checkPassword(true);
        }
        if(password == '' || (confirm && password2 == '')) {
            cp2.style.display = 'none';
            return;
        }
        if(password != password2) {
            warning(cp2, '两次输入的密码不一致');
        } else {
            cp2.style.display = '';
            cp2.innerHTML = '<img style="vertical-align:middle;" src="__ADMIN__/image/tips_ok.png" width="16" height="16">';
        }
    }
    function checkSeccode() {
        var seccodeVerify = document.getElementById('seccode').value;
        if(seccodeVerify == lastSecCode) {
            return;
        } else {
            lastSecCode = seccodeVerify;
        }
       // ajaxresponse('checkseccode', 'op=checkseccode&seccode=' + (is_ie && document.charset == 'utf-8' ? encodeURIComponent(seccodeVerify) : seccodeVerify));
    }
    function ajaxresponse(objname, data) {
        var x = new Ajax('XML', objname);
        x.get('{S_URL_ALL}/do.php?action=&' + data, function(s){
            var obj =document.getElementById(objname);
            if(trim(s) == 'succeed') {
                obj.style.display = '';
                obj.innerHTML = '<img style="vertical-align:middle;" src="__ADMIN__/image/tips_ok.png" width="16" height="16">';
                obj.className = "warning";
            } else {
                warning(obj, s);
            }
        });
    }
    function warning(obj, msg) {
        if((ton = obj.id.substr(5, obj.id.length)) != 'password2') { //'checkpassword'.substr(5,13)='password'
            $(ton).select();//input select
        }
        obj.style.display = '';
        obj.innerHTML = '<img style="vertical-align:middle;" src="__ADMIN__/image/tips_fail.png" width="16" height="16">&nbsp;' + msg;
        obj.className = "warning";
    }

    function checkPwd(pwd){

        if (pwd == "") {
            document.getElementById("chkpswd").className = "psdiv0";
            document.getElementById("chkpswdcnt").innerHTML = "";
        } else if (pwd.length < 6) { //原为3
            document.getElementById("chkpswd").className = "psdiv1";
            document.getElementById("chkpswdcnt").innerHTML = "密码由6-20个字符组成";
        } else if(!isPassword(pwd) || !/^[^%&]*$/.test(pwd)) {
            document.getElementById("chkpswd").className = "psdiv0";
            document.getElementById("chkpswdcnt").innerHTML = "";
        } else {
            var csint = checkStrong(pwd);
            switch(csint) {
                case 1:
                    //g("chkpswdcnt").innerHTML = "很弱";
                    document.getElementById("chkpswdcnt").innerHTML = "很弱";
                    $( "chkpswd" ).className = "psdiv"+(csint + 1);
                    break;
                case 2:
                    document.getElementById("chkpswdcnt").innerHTML = "一般";
                    $( "chkpswd" ).className = "psdiv"+(csint + 1);
                    break;
                case 3:
                    document.getElementById("chkpswdcnt").innerHTML = "很强";
                    document.getElementById("chkpswd").className = "psdiv"+(csint + 1);
                    break;
            }
        }
    }
    function isPassword(str){
        if (str.length < 3) return false;
        var len;
        var i;
        len = 0;
        for (i=0;i<str.length;i++){
            if (str.charCodeAt(i)>255) return false;
        }
        return true;
    }
    function charMode(iN){
        if (iN>=48 && iN <=57) //数字
            return 1;
        if (iN>=65 && iN <=90) //大写字母
            return 2;
        if (iN>=97 && iN <=122) //小写
            return 4;
        else
            return 8; //特殊字符
    }
    //计算出当前密码当中一共有多少种模式
    function bitTotal(num){
        modes=0;
        for (i=0;i<4;i++){
            if (num & 1) modes++;
            num>>>=1;
        }
        return modes;
    }

    //返回密码的强度级别
    function checkStrong(pwd){
        modes=0;
        for (i=0;i<pwd.length;i++){
            //测试每一个字符的类别并统计一共有多少种模式.
            modes|=charMode(pwd.charCodeAt(i));
        }
        return bitTotal(modes);
    }

    function refreshVerify() {
        var ts = Date.parse(new Date())/1000;
        var img = document.getElementById('verify_img');
        img.src = "/captcha?id="+ts;
    }
</script>
</body>
</html>
